<template>
  <el-menu
  :default-active="activeIndex"
  class="el-menu-demo"
  mode="horizontal"
  @select="handleSelect"
  text-color="#999999">
  <el-submenu index="1">
    <template slot="title">在线资源</template>
    <el-menu-item index="1-1" @click="ToPath('tiku',1)">题库</el-menu-item>
    <el-menu-item index="1-2" @click="ToPath('kejian',1)">课件</el-menu-item>
    <el-menu-item index="1-3" @click="ToPath('video',1)">视频</el-menu-item>
    <!--<el-menu-item index="1-4" @click="ToPath('taojuan',1)">套卷</el-menu-item>-->
  </el-submenu>
  <el-menu-item index="2" @click="ToPath('homework',2)"><a>在线作业</a></el-menu-item>
  <el-menu-item index="3" @click="ToPath('group',3)"><a >教学分组</a></el-menu-item>
  <el-menu-item index="4" @click="ToPath('classinfo',4)"><a>课堂表现</a></el-menu-item>
  <el-menu-item index="5" @click="ToPath('favorites',5)"><a>收藏夹</a></el-menu-item>
  <a class="pcdownload" href="http://web.skyeducation.cn/UploadFiles/lnPCDownload/hdkt.exe">安装授课端</a>
</el-menu>
</template>

<script>
	  export default {
	  	created(){
	  	},
	  	data(){
	  		return{
	  			 activeIndex: '1',
	  			 props:''
	  		}
	  	},
    methods: {
      handleOpen(key, keyPath) {
        
      },
      handleSelect(key, keyPath) {
        
      },
      ToPath(path,index) {
      	this.$router.replace({path:`/${path}/${index}`})
      }
    },
    watch:{
    	$route(){
	  		this.activeIndex=this.$route.params.index	  		
    	}
    }
  }
</script>

<style>
	::-webkit-scrollbar{
				display: none;
			}
	.el-menu--horizontal>.el-menu-item.is-active, .el-menu--horizontal>.el-submenu.is-active .el-submenu__title{
		color: #14acf4;
		border-bottom: 1px solid #14acf4;
	}
	.el-menu-item, .el-submenu__title{
		padding-left: 30px;
		padding-right: 30px;
		font-size: 18px;
	}
  .el-submenu .el-menu-item:hover{
  	background-color: #ecf5ff;
		color: #66b1ff
  }
  a.pcdownload{
  	text-decoration: none;
  	float: right;
  	display: inline-block;
  	text-align: center;
  	width: 88px;  	
  	height: 36px;
  	font-size: 14px;
		color: #FFFFFF;
		letter-spacing: 0.23px;
  	line-height: 30px;
  	background: url(../assets/images/PC.png) no-repeat center;
  	background-size: cover;
  	transform: translateY(15px);
  }
  a.pcdownload:hover{
  	color: deepskyblue;
  	
  }
</style>